<template>
	<div class="easyd-weixin-Box app_page">

		<div class="user_box app_box_content_list app_list_box MARGIN_BOTTOM_10">
			<div class="user_top_box T1">
				<!--<img src="../../../../static/homeImages/genjin.png" />-->
				<div class="txt_img">
					{{$userData.getNickname()[0]}}
				</div>
				<span>{{$userData.getNickname()}}<i class="fa fa-edit"></i></span>
				<samp class="C4 T2" @click="editPassword()">密码设置</samp>
			</div>
			<div class="user_bottom_box C2 T2">
				<span class="app_float_left">销售总额：{{buyMoney}}</span>
				<div class="app_float_right">成交数：{{userData.buyCount}}</div>
			</div>
		</div>

		<div class="app_box_flex" style="width: 100%;overflow: hidden;">
			<div class="app_box_flex_1 app_list_box" style="float: left;">
				<div class="app_box_content" @click="salesEssential('1')">
					<div class="app_box_content_left">
						百问百答
					</div>
					<div class="app_box_content_right">
						<span class="fa fa-angle-right fa-lg C2"></span>
					</div>
				</div>
			</div>
			<div class="app_box_flex_1 app_list_box" style="float: right;">
				<div class="app_box_content" @click="salesEssential('0')">
					<div class="app_box_content_left">
						专业培训
					</div>
					<div class="app_box_content_right">
						<span class="fa fa-angle-right fa-lg C2"></span>
					</div>
				</div>
			</div>
		</div>

		<div class="app_list_box MARGIN_BOTTOM_10">
			<div class="app_box_content">
				<div class="app_box_content_left">
					提成记录
				</div>
				<div class="app_box_content_right" @click="commissionRecord()">
					<span class="fa fa-angle-right fa-lg C2"></span>
				</div>
			</div>
		</div>

		<div class="top_box app_box_flex MARGIN_BOTTOM_10">
			<div class="app_box" @click="sellAdd('zhuguan')" v-if="$userData.getOsType() != 3 && $userData.getIsManager() == 1">
				<img src="../../../../static/userImages/tianjiaxiaoshou.png" />
				<p class="T2">添加主管员</p>
			</div>
			<div class="app_box" @click="sellAdd('xiaoshou')" v-else>
				<img src="../../../../static/userImages/tianjiaxiaoshou.png" />
				<p class="T2">添加销售员</p>
			</div>
			<div class="app_box" @click="salesHandover()">
				<img src="../../../../static/userImages/xiaoshoujiaojie.png" />
				<p class="T2">销售交接</p>
			</div>
			<div class="app_box" @click="publishingTasks()">
				<img src="../../../../static/userImages/faburenwu.png" />
				<p class="T2">发布任务</p>
			</div>
		</div>

		<div class="app_list_box MARGIN_BOTTOM_10">
			<div class="app_box_content" @click="loginOut()">
				<div class="app_box_content_left">
					退出登录
				</div>
				<div class="app_box_content_right">
					<span class="fa fa-angle-right fa-lg C2"></span>
				</div>
			</div>
			<!--<div class="app_box_content">
				<div class="app_box_content_left">
					系统设置
				</div>
				<div class="app_box_content_right">
					<span class="fa fa-angle-right fa-lg C2"></span>
				</div>
			</div>-->
		</div>

	</div>
</template>

<script>
	import { mapState, mapMutations } from "vuex";
	export default {

		data() {
			return {
				buyMoney:0
			};
		},
		computed: {
			...mapState({
				userData: state => state.UserModule.userData,
			})
		},
		mounted() {
			this.initData();
		},
		methods: {

			//  ...mapMutations(["ShopIndexModule/updateIsShopGuide"]),

			initData() {
				var params = {
					'u_id': this.$userData.getUID()
				};

				this.$easyUtil.startLoading(this);
				this.$http.postHttp(
					this.$API.apiMyIndex,
					params,
					rs => {
						console.log(rs);
						this.$easyUtil.endLoading(this);
						this.$store.commit("UserModule/updateUserData", rs);
						this.buyMoney = this.userData.buyMoney.toFixed(2);
					}
				);

			},

			//提成记录
			commissionRecord(e) {
				if(this.$userData.getIsManager() == '0' || this.$userData.getIsManager() == 0){
					this.$easyUtil.alert(this,'提示','管理员才可以查看');
					return;
				}
				this.$easyUtil.GO(this,'/commissionRecord');
			},
			//销售必备
			salesEssential(type) {
//				sessionStorage.removeItem('navListActive');
				if(type == '1'){
					sessionStorage.setItem('navListActive',0)
				}else{
					sessionStorage.setItem('navListActive',2)
				}
				this.$easyUtil.GO(this,'/salesEssential',{type:type});
			},
			//密码设置
			editPassword(e) {
				this.$easyUtil.GO(this,'/editPassword');
			},
			//添加销售员
			sellAdd(type) {
				if(this.$userData.getIsManager() == 0){
					this.$easyUtil.alert(this,"提示","权限不足！")
					return;
				}else{
					this.$easyUtil.GO(this,'/sellAdd',{type:type});
				}
			},
			salesHandover(){
				this.$easyUtil.alert(this,"提示","敬请期待！")
			},
			publishingTasks(){
				this.$easyUtil.alert(this,"提示","敬请期待！")
			},
			//退出登录
			loginOut(e) {
				var that = this;
				this.$easyUtil.confirm(this,'提示','确定退出登录',function(){
					localStorage.clear();
					sessionStorage.clear();
					that.$easyUtil.GO(that,'/login');
				})
			},
		}
	};
</script>

<style lang="stylus" scoped>
	@import '~PUBLIC_CSS';
	.top_box {}
	
	.top_box .app_box {
		margin-right: 10px;
	}
	
	.top_box .app_box:last-child {
		margin-right: 0px;
	}
	
	.top_box .app_box img {
		width: 40%;
		margin: 0 auto;
		display: block;
		padding-bottom: 5px;
	}
	
	.top_box .app_box p {
		text-align: center;
	}
	
	.user_box {
		overflow: hidden;
		background: #FBD415;
	}
	
	.user_box .user_top_box {
		height: 50px;
		line-height: 50px;
		position: relative;
	}
	
	.user_box .user_top_box span {
		position: relative;
	}
	
	.user_box .user_top_box span i {
		position: absolute;
		top: -5px;
		right: -20px;
		color: #008000;
	}
	
	.user_box .user_top_box samp {
		position: absolute;
		right: 0;
		top: -10px;
	}
	
	.user_box .user_top_box .txt_img {
		display: block;
		height: 40px;
		width: 40px;
		margin: 5px;
		margin-left: 0;
		margin-right: 10px;
		text-align: center;
		line-height: 40px;
		background: #000;
		color: gold;
		float: left;
		border-radius: 100px;
		object-fit: cover;
	}
	
	.user_box .user_top_box img {
		display: block;
		height: 40px;
		width: 40px;
		padding: 5px 5px 5px 0;
		float: left;
		object-fit: cover;
	}
	
	.user_box .user_bottom_box {
		overflow: hidden;
		width: 100%;
	}
</style>